<template>
  <div class="app-container">
    <el-row :gutter="20">
      <el-col :span="12">
        <el-select v-model="method" placeholder="请选择">
          <el-option
            v-for="item in methods"
            :key="item"
            :label="item"
            :value="item"
          >
          </el-option>
        </el-select>
        <el-input placeholder="请输入内容" v-model="path" clearable> </el-input>
        <el-input
          type="textarea"
          :rows="10"
          placeholder="请输入内容"
          v-model="body"
        >
        </el-input>
        <el-button @click="send">请求</el-button>
      </el-col>
      <el-col :span="12">
        <el-input
          type="textarea"
          :rows="20"
          placeholder="请输入内容"
          :disabled="true"
          v-model="response"
        >
        </el-input>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import { test } from "@/api/system/test";
export default {
  data() {
    return {
      methods: ["GET", "POST", "DELETE", "PUT"],
      method: "",
      path: "",
      response: "",
      body: "{}"
    };
  },
  methods: {
    send() {
      let _this = this;
      test({ path: this.path, method: this.method, body: JSON.parse(_this.body) })
        .then((response) => {
          //console.log(response);
          _this.response = response.code + ":" + response.msg + ":" + JSON.stringify(response.data);
          response.data.forEach(item => {
            _this.response = _this.response + ":" + JSON.stringify(item);
          })
        })
    },
  },
};
</script>